<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<%@page import="com.cap.bts.framework.usermgnt.constant.EmployeeStatus"%>    
    
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>生成会员卡</title>
<%@include file="../include/include.jsp"%>
<link rel="stylesheet" type="text/css" href="${csspath }/public.css"/>
<link rel="stylesheet" type="text/css" href="${csspath }/datepicker.css"/>
<link rel="stylesheet" type="text/css" href="${csspath }/style_l.css"/>
<script type="text/javascript" src="${jspath }/jquery-1.4.4.js"></script>
<script type="text/javascript" src="${jspath }/jquery.ui.min.js"></script>
<script type="text/javascript" src="${jspath }/ui.datepicker_zh-CN.js"></script>
<script type="text/javascript" src="${jspath }/jquery.blockUI.js"></script>
<script type="text/javascript" src="${jspath }/public.js"></script>
<script type="text/javascript" src="${jspath }/jquery.selectAll.js"></script>
<script type="text/javascript" src="${jspath}/jquery/jquery.ui.draggable.js"></script>
<script type="text/javascript" src="${jspath}/jquery/jquery.alerts.js"></script>
<link rel="stylesheet" type="text/css" href="${csspath}/jquery.alerts.css" />

<link rel="stylesheet" type="text/css"
	href="${webcontext}/css/validationEngine.jquery.css" />
<script src="${jspath}/jquery/validate/jquery.validationEngine.js"
	type="text/javascript"></script>
<script src="${jspath}/jquery/validate/jquery.validationEngine-zh.js"
	type="text/javascript"></script>
	<script type="text/javascript"
	src="${webcontext}/javascript/jquery/jquery.ui.draggable.js"></script>
<link rel="stylesheet" type="text/css"
	href="${bootstrapPath}/css/bootstrap.css" />
<script type="text/javascript" src="${bootstrapPath}/js/bootstrap.js"></script>
<style type="text/css">
.formError .formErrorContent {
    -moz-border-radius: 6px 6px 6px 6px;
    -moz-box-shadow: 0 0 6px #000000;
    background: none repeat scroll 0 0 #EE0101;
    border: 2px solid #DDDDDD;
    color: #FFFFFF;
    font-family: tahoma;
    font-size: 11px;
    padding: 4px 10px;
    width: 100px;
}
</style>
<script type="text/javascript">  
    var clientH = null;  
    var jq = jQuery.noConflict();  
    var h=null;  
        window.onload = function zhezhao(){  
            clientH = document.documentElement.clientHeight;  
            if(isSafari=navigator.userAgent.indexOf("Safari")>0){  
                h = document.body;  
            }else{  
                h =document.documentElement;  
            }  
        }  
        function showBg(elem){  
            var w = (document.documentElement.clientWidth/2)-(jq("#"+ elem).width()/2);  
            jq("#"+ elem).css("top",(h.scrollTop+ (clientH/2)-(jq("#"+ elem).height()/2))+"px");  
            jq("#"+ elem).css("left",w+"px");  
            jq("#fullbg").css("display","block");  
            jq("#"+ elem).css("display","block");  
        }  
         
        function closeBg(){  
            jq("#fullbg").css("display","none");  
            jq("#dialog").css("display","none");  
        }  
</script>  
  
  
<style type="text/css">  
*{  
font-family:Microsoft YaHei;  
}  
#fullbg{   
background-color: Gray;  
display:none;  
z-index:3;  
position:fixed;  
left:0px;  
top:0px;  
width:100%;  
height:100%;  
filter:Alpha(Opacity=30);  
/* IE */  
-moz-opacity:0.4;  
/* Moz + FF */  
opacity: 0.4;  
}  
 
#dialog {   
position:relative;left:100px; top:150px;
width:200px;  
height:30px;
line-height:30px;
background:#FFF;  
display: none;  
z-index: 5;  
//overflow:scroll;  
}  
  
</style>
<script type="text/javascript">
function showEndNum(id){
	var quantity=$("#txt_quantitiy"+id).val();
	if(isNaN($("#txt_quantitiy"+id).val())){
		jAlert("数量必须为数字");
		return;
	}
	if($("#txt_quantitiy"+id).val()<0){
		jAlert("数量不能小于0");
		return;
	}
	if($("#txt_quantitiy"+id).val()>100000){
		jAlert("每张卡单次生成数量不能超过1000000");
		return;
	}  
	if($("#txt_quantitiy"+id).val()==''){
		return;
	}
		$.ajax({
			type:'POST',
			url: '${webcontext}/crmdp/dealer/card/getCardNumTo',
			data : "id="+id+"&quantity="+$("#txt_quantitiy"+id).val(),
			//async: false, //同步请求，默认情况下是异步（true）
			beforeSend: function(){ 
			},
			success : function(data) {
				//closeBg();
				$("#td_cardNumTo"+id).html(data.cardNumTo);
				if(data.baseDto.errorMsg!=null && data.baseDto.errorMsg!=''){
					jAlert($("#txt_name"+id).val()+"，"+data.baseDto.errorMsg);
					$("#txt_quantitiy"+id).val(data.quantity);
				}
			
			}
		});	
}
function generateCard(){
	var isErr=false;
	$("input[name='quantity']").each(function(index, element) {
		if(isNaN($(this).val())){
			jAlert("数量必须为数字");
			isErr=true;
			//return false;
		}
		if($(this).val()<0){
			jAlert("数量不能小于0");
			isErr=true;
			//return false;
		}
		if($(this).val()>100000){
			jAlert("每张卡单次生成数量不能超过1000000");
			isErr=true;
			//return false;
		}  
    });
/* 	 $("input[name='id']").each(function(index, element) {
		$.ajax({
			type:'POST',
			url: '${webcontext}/crmdp/dealer/card/getCardNumTo',
			data : "id="+id+"&quantity="+$("#txt_quantitiy"+id).val(),
			//async: false, //同步请求，默认情况下是异步（true）
			success : function(data) {
				alert("开始生成卡片0"+data);
				$("#td_cardNumTo"+id).html(data.cardNumTo);
				if(data.baseDto.errorMsg!=null && data.baseDto.errorMsg!=''){
					jAlert($("#txt_name"+id).val()+"，"+data.baseDto.errorMsg);
					$("#txt_quantitiy"+id).val(data.quantity);
				}
			}
		});	 
    });  */
	/* 
	 $.ajax({
		type:'POST',
		url: '${webcontext}/crmdp/dealer/card/getCardNumTo',
		data : "id="+id+"&quantity="+$("#txt_quantitiy"+id).val(),
		async: false, //同步请求，默认情况下是异步（true）
		beforeSend: function(){ 
		},
		success : function(data) {
			$("#td_cardNumTo"+id).html(data.cardNumTo);
			if(data.baseDto.errorMsg!=null && data.baseDto.errorMsg!=''){
				jAlert($("#txt_name"+id).val()+data.baseDto.errorMsg);
				$("#txt_quantitiy"+id).val(data.quantity);
			}
		}
	});	  */
	
	if(!isErr){
		$.ajax({
			type:'POST',
			url: '${webcontext}/crmdp/dealer/card/generateCard',
			data : $("#form").serialize(),
			//async: false, //同步请求，默认情况下是异步（true）
			beforeSend: function(){ 
				showBg('dialog'); 
			},
			success : function(data) {
				closeBg();
				jAlert('生成成功', '提示', function() { 
					window.location.href='${webcontext}/crmdp/dealer/card/toCreateCard'});
				} 
			});
		}
}

function exportCard(){
	window.location.href="${webcontext}/crmdp/dealer/card/toExportCard";
}
</script>
</head>
<body>

<!-- JS遮罩层 -->  
<div id="fullbg"></div>  
<!-- end JS遮罩层 -->  
<!-- 对话框 -->  
<div id="dialog">  
<div style="text-align: center;">正在生成，请稍后...
<!--<a href="#" onclick="closeBg();">关闭</a>-->  
</div>  
</div>  
<!-- JS遮罩层上方的对话框 -->  
	<div id="content">
		<div id="wrap">
			<!-- search_div -->
			<form:form class="form-horizontal" id="form" action="#" method="post">
				<!-- <input type="hidden" id="idHtxt" name="id">
			<input type="hidden" id="mobilePhoneHtxt" name="mobilePhone">
			<input type="hidden" id="memberNameHtxt" name="memberName">
			<input type="hidden" id="carPlateHtxt" name="carPlate"> -->
				<div class="spliter h_10"></div>

				<div id="dataTable" class="dataTable">
					  <table id="table" class="table">

						<tr>
							<th width="25%">卡片名称</th>
							<th width="15%">数量</th>
							<th width="15%">起始卡号</th>
							<th width="15%">终止卡号</th>

						</tr>
						<core:forEach items="${CardCreateResultsListDto}" var="list">
							<tr>
								<td class="align_m"><input type="hidden" name="id"  value="${list.cardDefinition.id}" >
								<input type="hidden" name="usedUpFlag"  value="${list.usedUpFlag}"> 
									<input type="hidden" id="txt_name${list.cardDefinition.id}" name="name" value="${list.cardDefinition.name}">
								${list.cardDefinition.name}</td>
								<td class="align_m">
								<core:if test="${list.usedUpFlag}">
									<input type="hidden" id="txt_quantitiy${list.cardDefinition.id}" name="quantity"  value="0" >请修改卡片定义前缀
								</core:if>
								<core:if test="${!list.usedUpFlag}">
									<input id="txt_quantitiy${list.cardDefinition.id}" class="form-control input-sm" style="width:100px" name="quantity" onChange="showEndNum('${list.cardDefinition.id}')" value="" >
								</core:if>
								</td>
								<td class="align_m">${list.cardNumFrom}</td>
								<td class="align_m" id="td_cardNumTo${list.cardDefinition.id}"></td>
							</tr>
						</core:forEach>
					</table>
				</div>
				   <div class="spliter h_5"></div>
				      <div class="spliter h_5"></div>
				    <div class="btn_div">
                <button type="button" class="btn" style="width: 100px;" value="生成卡号" onclick="javascript:generateCard()"><i class="glyphicon glyphicon-inbox" style="color:#FFFFFF"></i>&nbsp;生成卡号</button>
                <button type="button" class="btn" style="width: 100px;" value="导出卡号" onclick="javascript:exportCard()"><i class="glyphicon glyphicon-open" style="color:#FFFFFF"></i>&nbsp;导出卡号</button>
            </div>
			</form:form>
		</div>
	</div>
</body>
</html>